<!DOCTYPE HTML>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>限时抢购</title>
    <link rel="stylesheet" type="text/css" href="../css/api.css" />
    <link rel="stylesheet" type="text/css" href="../css/aui.css" />
    <link rel="stylesheet" type="text/css" href="../css/common.css" />
    <style>
        html,
        body {
            height: 140px
        }

        .jb .title {
            width: 100%;
            text-align: center;
            line-height: 80px;
            margin-bottom: 60px;
            color: #fff;
            position: relative;
            display: flex;
            text-align: center;
            align-items: center;
            justify-content: center;
        }

        .jb .title>div {
            position: absolute;
            left: 10px;
            font-size: .8rem;
        }

        #ulList .aui-list-item-media,
        #ulList .aui-list-item {
            padding: 0;
        }

        #ulList .aui-list-item-media {
            padding: .5rem;
            width: 6rem;
        }

        #ulList .aui-list-item-title {
            font-size: .6rem;
        }

        #ulList .aui-list-item-text1 {
            font-size: .6rem
        }

        #ulList .aui-list-item-text1 span {
            font-size: .8rem;
            color: red;
        }

        #ulList .aui-list-item-text2 {
            text-decoration: line-through;
            font-size: .5rem;
            color: #ccc;
        }

        #ulList .aui-list-item-text3 {
            font-size: .6rem;
            display: flex;
            text-align: center;
            align-items: center;
            justify-content: space-between;
        }

        #ulList .aui-list-item-text3 span {
            border-radius: 5px;
            padding: .25rem .5rem;
            background-color: red;
            color: #fff;
        }

        #ulList .aui-list-item-media img {
            width: 100%;
            height: 100%;
            border-radius: 5px;
        }
    </style>
</head>

<body class="jb">
    <h2 class='title'>
        <div onclick="closeWin();">
            <span class="aui-iconfont aui-icon-left"></span>&nbsp;&nbsp;返回
        </div>
        限时秒杀
    </h2>
</body>
<script type="text/javascript" src="../script/api.js"></script>
<script type="text/javascript" src="../script/zepto.min.js"></script>
<script type="text/javascript" src="../script/common.js"></script>
<script type="text/javascript" src="../script/doT.min.js"></script>
<script type="text/javascript">
    var NVNavigationBar;
    apiready = function() {
        NVNavigationBar = api.require('NVNavigationBar');
        //	快抢时间点：1.昨天的0点，2.昨天10点，3.昨天12点，4.昨天15点，5.昨天20点，6.今天的0点，7.今天10点，8.今天12点，9.今天15点，10.今天20点，11.明天的0点，12.明天10点，13.明天12点，14.明天15点，15.明天20点
        var items = [{
            title: '昨天0点'
        }, {
            title: '昨天10点'
        }, {
            title: '昨天12点'
        }, {
            title: '昨天15点'
        }, {
            title: '昨天20点'
        }, {
            title: '今天0点'
        }, {
            title: '今天10点'
        }, {
            title: '今天12点'
        }, {
            title: '今天15点'
        }, {
            title: '今天20点'
        }, {
            title: '明天0点'
        }, {
            title: '明天10点'
        }, {
            title: '明天12点'
        }, {
            title: '明天15点'
        }, {
            title: '明天20点'
        }, ];
        for (var i = 0; i < items.length; i++) {
            items[i].bg = 'rgba(255,255,255,0)'
            items[i].bgSelected = '#fff'
        }
        NVNavigationBar_open(items);
    };

    function NVNavigationBar_open(items) {
        NVNavigationBar.open({
            rect: {
                x: 0,
                y: 60,
                w: api.frameWidth,
                h: 80
            },
            styles: {
                orientation: 'horizontal',
                bg: 'rgba(255,255,255,0)',
                bgAlpha: 1,
                font: {
                    size: 12,
                    sizeSelected: 14,
                    color: '#fff',
                    colorSelected: '#FF0000',
                },
                itemSize: {
                    w: api.frameWidth / 5,
                    h: 80
                }
            },
            items: items,
            selectedIndex: 0,
            fixedOn: api.frameName,
            fixed: false,
            id: 'first'
        }, function(ret, err) {
            //if (ret.eventType == 'click') {
            var hour_type = ret.index ? ret.index : '0'
            var urlTransform = window.urlTransformZGD(window.APIServerZGD.LimitTime, {
                    hour_typeVal: hour_type+1,
                    min_idVal: '1'
                })
            console.log(urlTransform)
            var hour_typeVal = hour_type+1;
            _Ajax(urlTransform, 'get', {}, 'json', function(ret) {
                var data = ret.data;
                console.log(JSON.stringify(ret))
                if (ret.code === 1) {
                    api.closeFrame({
                        name: 'limit_frm'
                    });
                    api.openFrame({
                        name: 'limit_frm',
                        url: './limit_frm.html',
                        //url: 'widget://html/limit_frm.html',
                        bounces: false,
                        pageParam: {
                            data: data,
                            hour_typeVal: hour_typeVal,
                            min_idVal: ret.min_id
                        },
                        rect: {
                            x: 0,
                            y: 140,
                            w: 'auto',
                            h: 'auto',
                        }
                    });
                } else {
                    console.log(JSON.stringify(ret.msg))
                }
            });
            //}
        });
    }
</script>

</html>
